<template>
  <div style="height: 100%">
    <a-spin :spinning="loading" wrapperClassName="spinning-container">
      <page-header :title="l('Maintenance')"></page-header>
      <a-card :bordered="false">
        <a-tabs defaultActiveKey="1">
          <!-- 缓存 -->
          <a-tab-pane key="1" :tab="l('Caching')">
            <a-card :title="l('CachesHeaderInfo')" :bordered="false">
              <template #extra>
                <a-button type="primary" @click="clearAllCaches">
                  <delete-outlined />
                  {{ l('ClearAll') }}
                </a-button>
              </template>
              <a-table
                :columns="columns"
                :showHeader="false"
                :pagination="false"
                :data-source="cashtabledata"
                :rowKey="
                  (index) => {
                    return index;
                  }
                "
              >
                <template #action="{ record }">
                  <span>
                    <a @click="clearCache(record)">清空</a>
                  </span>
                </template>
              </a-table>
            </a-card>
          </a-tab-pane>
          <!-- 网站日志 -->
          <a-tab-pane key="2" :tab="l('WebSiteLog')">
            <a-card :title="l('WebSiteLogsHeaderInfo')" :bordered="false">
              <template #extra>
                <a-button type="primary" @click="downloadWebLogs">
                  <download-outlined />
                  {{ l('DownloadAll') }}
                </a-button>
                <a-button type="primary" @click="getWeblogData">
                  <reload-outlined />
                  {{ l('Refresh') }}
                </a-button></template
              >
              <div class="web-log-view">
                <p v-for="(item, index) in weblogList" :key="index">{{ item }}</p>
              </div>
            </a-card>
          </a-tab-pane>
        </a-tabs>
      </a-card>
    </a-spin>
  </div>
</template>

<script lang="ts">
  import { AppComponentBase } from '/@/shared/component-base';
  import {
    EntityDtoOfString,
    HostCacheDto,
    HostCachingServiceProxy,
    WebSiteLogServiceProxy,
  } from '/@/shared/service-proxies';
  import { fileDownloadService } from '/@/shared/utils';
  import { DeleteOutlined, DownloadOutlined, ReloadOutlined } from '@ant-design/icons-vue';
  import { defineComponent } from 'vue';
  export default defineComponent({
    name: 'maintenance',
    components: {
      DeleteOutlined,
      DownloadOutlined,
      ReloadOutlined,
    },
    mixins: [AppComponentBase],
    data() {
      return {
        // 缓存
        hostCachingServiceProxy: new HostCachingServiceProxy(),
        webSiteLogServiceProxy: new WebSiteLogServiceProxy(),
        cashtabledata: [] as HostCacheDto[],
        columns: [
          {
            dataIndex: 'name',
            key: 'name',
            slots: { title: 'customTitle', customRender: 'name' },
          },
          {
            title: 'Action',
            key: 'action',
            slots: { customRender: 'action' },
          },
        ],
        // web日志
        weblogList: [] as string[],
      };
    },
    mounted() {
      this.getCashData();
      this.getWeblogData();
    },
    methods: {
      /**
       * 获取混存数据
       */
      getCashData(): void {
        this.loading = true;
        this.hostCachingServiceProxy
          .getAllCaches()
          .finally(() => {
            this.loading = false;
          })
          .then((res) => {
            this.cashtabledata = res.items as HostCacheDto[];
          });
      },
      /**
       * 获取网站log
       */
      getWeblogData(): void {
        this.loading = true;
        this.webSiteLogServiceProxy
          .getLatestWebLogs()
          .finally(() => {
            this.loading = false;
          })
          .then((res) => {
            this.weblogList = res.latestWebLogLines as string[];
          });
      },
      /**
       * 单个清空缓存
       */
      clearCache(item: HostCacheDto): void {
        this.loading = true;
        let entitys = new EntityDtoOfString();
        entitys.id = item.name;
        this.hostCachingServiceProxy
          .clearCache(entitys)
          .finally(() => {
            this.loading = false;
          })
          .then(() => {
            this.notify.success(this.l('CacheSuccessfullyCleared'));
            this.getCashData();
          });
      },
      /**
       * 清理全部缓存
       */
      clearAllCaches(): void {
        this.loading = true;
        this.hostCachingServiceProxy
          .clearAllCaches()
          .finally(() => {
            this.loading = false;
          })
          .then(() => {
            this.notify.success(this.l('AllCachesSuccessfullyCleared'));
            this.getCashData();
          });
      },
      /**
       * 下载日志
       */
      downloadWebLogs(): void {
        this.loading = true;
        this.webSiteLogServiceProxy
          .downloadWebLogs()
          .finally(() => {
            this.loading = false;
          })
          .then((result) => {
            fileDownloadService.downloadTempFile(result);
          });
      },
    },
  });
</script>

<style scoped lang="less">
  .web-log-view {
    max-height: 400px;
    overflow-y: scroll;
  }
</style>
